.commonHeader{
    z-index: 999;
    display flex;
    justify-content space-around;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 2.1rem;
    background: rgba(7,35,68,.5);
    .logo {
        cursor pointer;
        width 7.9rem;
        height 0.96rem;
    }
}

.tabUl{
    height 100%;
    display: flex;
    justify-content: flex-start;
    align-items: end;
    margin-left: 0.96rem;
}

.tabItem{
    position relative;
    display flex;
    justify-content center;
    align-items: center;
    user-select none;
    cursor: pointer;
    transition all .3s;
    width: 1.74rem;
    height 100%;
    color #B9DBED;
    text-align: center;
    &:hover{
        color #fff;
    }
    &.active {
        color: #fff;
    }
    &.active::after{
        position absolute;
        bottom 0;
        left 0;
        content: "";
        width 1.74rem;
        height 4px;
        background: linear-gradient(24deg,rgba(238,238,238,1) 0%,rgba(24,167,240,1) 100%);
    }
}